今回は、スタイルシートを後から読み込むテクニックを紹介します。通常、ホームページは、初めからスタイルシートが適用された状態で表示されます。しかし、このテクニックを利用すると、ページが表示されたあと好きなタイミングでスタイルシートを追加できます。ここでは、クイズページを例に、その概要を紹介してみましょう。

まずは、普通にHTMLやCSSを記述してページを作成します。今回は、以下のようなクイズページを作成しました。このHTMLにはクイズの答えも記されていますが、文字が白色に指定されているため、実際には見えません。また、【解答を見る！】のボタンにonClickイベントを追加し、ボタンをクリックするとJavaScript関数「roadcss()」を呼び出すようにしておきます。 <B>問題（1）</B><BR> 日本で一番高い山は？<BR> <BR> <BUTTON onClick="roadcss()">解答を見る！</BUTTON><BR> <FONT size=2>※Internet Explorer 5.0以降で動作します</FONT><BR> <BR> <DIV class="anser" style="width:100px; padding:5px;"> <FONT color=#FFFFFF>答え：富士山</FONT> </DIV>

	続いて、CSSを読み込むJavaScript関数「roadcss()」を作成します。新たにCSSを読み込む場合は、「document.createStyleSheet()」とJavaScriptを記述します。カッコ内には、読み込むCSSファイル名を記述するようにしてください。なお、「document.createStyleSheet()」はInternet Explorer 5.0以降でのみ動作するJavaScriptとなります。他のブラウザでは、正しく機能しない点に注意してください。 <SCRIPT language="JavaScript"> <!-- function roadcss(){ document.createStyleSheet('kotae.css'); } // --> </SCRIPT>

	最後に、読み込まれるCSSファイルを作成すればテクニックの完成です。なお、CSSファイルを作成する際は、その拡張子を「.css」にしておくのを忘れないでください。今回の例では、答えが記されているDIVタグ（class="anser"）について、背景色を赤色にするCSSを作成しました。【解答を見る！】のボタンがクリックされると、このCSSが適用され、白色で表示されている答えが読めるようになる仕組みです。この例のほかにも、工夫次第でユニークなページを作成できると思います。ぜひ、試してみてください。 div.anser{ background-color:#FF0000; }

�e�����[�N����EC�i�r Yahoo �y�V LINE���f�[�^�����[�������z500�~�`�I
�����z�[���y�[�W �������N���W�b�g�J�[�h �C�O�i���q�����@�C�O���s�����������I �C�O�z�e��